import { Layout, Space } from 'antd';
import Leftborder from '../components/Leftborder'
import { Outlet } from 'react-router-dom';
const { Header, Sider, Content } = Layout;
//动态路由
// import Dynamicrouting from '../components/Dynamicrouting'
const headerStyle = {
    textAlign: 'center',
    color: '#fff',
    height: 100,
    paddingInline: 50,
    lineHeight: '64px',
};
const left = {
    width: '280px',
    height: "100px",
    lineHeight: "100px",
    background: "#61dafb",
    float: "left"
}
const right = {
    float: "right",
    width: '280px',
    height: "100px",
    lineHeight: "100px",
    background: "#61dafb",
}

const contentStyle = {
    textAlign: 'center',
    minHeight: 100,
    lineHeight: '120px',
    color: '#fff',
    // backgroundColor: '#108ee9',
};
const siderStyle = {
    textAlign: 'center',
    // lineHeight: '200vw',
    color: '#fff',
};
const App = () => (
    <Space
        direction="vertical"
        style={{
            width: '100%',
        }}
        size={[0, 48]}
    >
        <Layout>
            <Sider style={siderStyle}>
                <Leftborder></Leftborder>
            </Sider>
            <Layout>
                <Header style={headerStyle}>
                    <div style={left}>
                        {/* <Dynamicrouting></Dynamicrouting> */}
                    </div>
                    <div style={right}>
                        右
                    </div>
                </Header>
                <Content style={contentStyle}>
                    <Outlet></Outlet>
                </Content>
            </Layout>
        </Layout>
    </Space>
);
export default App;